import React, {FC, useEffect} from 'react';

import SortableList from './SortableList';
import { useListsStore } from '../store/listStore'
import { ListPropsType } from "./interface";
 
const Component: FC<ListPropsType> = (props: ListPropsType) => {

    const {
        data = [],
        getListItems,
     } = props;
    
    const setLists = useListsStore((state) => state.setLists);

    const items = useListsStore((state) => state.items);
    

    useEffect(() => {
        setLists(data);
    }, []);

    useEffect(() => {
        if (getListItems) {
            getListItems(items);
        };
    }, [items]);
    
      
    
    return <div>
        <SortableList />
    </div>
};

export default Component;